<template>
	<div >
		<el-dialog v-model="isShowDialog" title="请求组盘电芯" width="1000" draggable="">
			<el-form :model="ruleForm" ref="ruleFormRef" size="default" label-width="100px" :rules="rules">
				<el-row :gutter="35">
				
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item label="类型">
							<el-select v-model="ruleForm.contractTag"  >
						    <el-option
						      v-for="item in options"
						      :key="item.value"
						      :label="item.label"
						      :value="item.value"
						    />
						  </el-select>
			              </el-form-item>
						
					</el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" v-if="ruleForm.contractTag==200">
						<el-form-item label="托盘号" >
							<el-input v-model="ruleForm.message" placeholder="托盘号" clearable />
							
						</el-form-item>
						
					</el-col>
					<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20" v-if="ruleForm.contractTag==201">
						<!-- <el-form-item label="时间范围" >
							<el-input v-model="ruleForm.messageTime" placeholder="2023-02-03 12:00:00*2023-02-08 12:00:00" clearable />
							
						</el-form-item> -->

						<el-form-item label="时间范围">
					<el-date-picker placeholder="请选择创建时间" value-format="YYYY-MM-DD HH:mm:ss" type="datetimerange" v-model="timeRange" />
              </el-form-item>
						
					</el-col>
				
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
						<el-form-item label="线体" >
							<el-input v-model="ruleForm.id" placeholder="线体+10" clearable />
							
						</el-form-item>
						
					</el-col>
					
					
				</el-row>
			</el-form>
			<template #footer>
				<span class="dialog-footer">
					<el-button @click="cancel" size="default">取 消</el-button>
					<el-button type="primary" @click="submit" size="default">确 定</el-button>
				</span>
			</template>
		</el-dialog>
	</div>
</template>

<script lang="ts" setup>
	import { ref,onMounted } from "vue";
	import { ElMessage } from "element-plus";
	import type { FormRules } from "element-plus";
	import { PushRemoteCell } from '/@/api/main/patCell';
	

	const options = [
  {
    value: 200,
    label: '托盘号',
  },
  {
    value: 201,
    label: '时间范围',
  }
 
  
]


	//父级传递来的函数，用于回调
	const emit = defineEmits(["reloadTable"]);
	const ruleFormRef = ref();
	const isShowDialog = ref(false);
	const timeRange = ref<[Date, Date]>([
  new Date(),
  new Date(),
])
	const ruleForm = ref<any>({});
		//自行删除非必填规则
		const rules = ref<FormRules>({
  
  id: [{required: true, message: '线体必须填写', trigger: 'blur',},]
  
});

// 打开弹窗
const openDialog = (row: any) => {
  ruleForm.value = JSON.parse(JSON.stringify(row));
  isShowDialog.value = true;
};

// 关闭弹窗
const closeDialog = () => {
  emit("reloadTable");
  isShowDialog.value = false;
};

// 取消
const cancel = () => {
  isShowDialog.value = false;
};

const dateTimeToString=(date:Date)=> {
    var y = date.getFullYear();
    var M = date.getMonth() + 1;
    var d = date.getDate();
    var H = date.getHours();
    var m = date.getMinutes();
    var s = date.getSeconds();
    return y + '-' + (M < 10 ? ('0' + M) : M) + '-' + (d < 10 ? ('0' + d) : d) + " " + (H < 10 ? ('0' + H) : H) + ":" + (m < 10 ? ('0' + m) : m) + ":" + (s < 10 ? ('0' + s) : s);
}

// 提交
const submit = async () => {
  ruleFormRef.value.validate(async (isValid: boolean, fields?: any) => {
    if (isValid) {
      let values = JSON.parse(JSON.stringify(ruleForm.value)); 

	 
	  if(values.contractTag==201){
	   let msgTime= timeRange.value[0]+'*'+timeRange.value[1];
	  
		values.message=msgTime;
		
	  }

      await PushRemoteCell(values);
      closeDialog();
    } else {
      ElMessage({
        message: `表单有${Object.keys(fields).length}处验证失败，请修改后再提交`,
        type: "error",
      });
    }
  });
};





// 页面加载时
onMounted(async () => {
});

//将属性或者函数暴露给父组件
defineExpose({ openDialog });
</script>




